<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
</head>

<body style="height: 2000px;">
	<button id="btn">点击</button>

</body>
<script src="">
	let btn = document.querySelector('#btn');
	btn.addEventListener('click', function () {
		Promise.resolve().then(() => {
			console.log(1);
		});
		console.log(2);
	});
	btn.addEventListener('click', function () {
		Promise.resolve().then(() => {
			console.log(3);
		});
		console.log(4);
	});
</script>
<script src="">
	// 延迟函数
	const delay = function delay(callback, time = 1000) {
		if (typeof callback !== "function") {
			callback = () => { }
		}
		time = +time
		if (isNaN(time)) time = 1000

		let timer = setTimeout(() => {
			callback()
			clearTimeout(timer)
		}, time);
	}
	// 基于Promise的延迟函数
	const delayPro = function delayPro(time = 1000) {
		return new Promise(resolve => {
			let timer = setTimeout(() => {
				resolve()
				clearTimeout(timer)
			}, time);
		})
	}

	console.log('AAA');
	delayPro().then(() => {
		console.log('BBB');
		return delayPro(1000)
	}).then((value) => {
		console.log('CCC', value);
	})



</script>
<script src="">
	// 防抖
	const debounce = function (fn, t) {
		let timer = null
		return function (...args) {
			console.log(args);
			if (timer) clearTimeout(timer)
			timer = setTimeout(() => {
				// fn.apply(this, args)
				fn(...args)
			}, t);
		}
	}

	const anniu = function (num) {
		console.log('1111', num);
	};
	btn.addEventListener('click', debounce(anniu, 1000));



</script>
<script>
	function callback() {
		console.log('555555');
	}

	function f(callback) {
		setTimeout(function () {
			var data = 'hello';
			callback(data);
			console.log(1111);
		}, 1000)
	}

	f(callback)



</script>

</html>